<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>大学排行榜</title>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans+SC:100,300,400,500,700,900">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Serif+SC:200,300,400,500,600,700,900">
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.0-alpha1/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.0.0-alpha1/js/bootstrap.bundle.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.slim.min.js"></script>
    <link rel="stylesheet" type="text/css" media="screen" href="https://cdn.staticfile.org/ionicons/2.0.1/css/ionicons.min.css">

    <link href="css/zzsc.css" rel="stylesheet">
    <link href="css/maps.css" rel="stylesheet">
    <link rel="stylesheet" href="./assets/style.css">
    <script type="text/javascript" src="js/maps.js"></script>
    <script type="text/javascript" src="js/google.js"></script>

</head>
<body>
<style>
    a:hover{ text-decoration:underline;color: #FF5907; }
</style>
<div id="app">
<ul   class="nav ">
    <li style="float: left;padding-left:320px " > <a style="font-size: 10px" href="#">会员权益</a></li>
    <li style="float: left;padding-left:10px " > <a style="font-size: 10px" href="#">文本比较</a></li>
    <li style="float: left;padding-left:10px " > <a style="font-size: 10px" href="#">在线代码</a></li>
    <li style="float: left;padding-left: 900px" ><a style="font-size: 10px" @click="location.href='./userUpdate.html'" >修改信息 </a>&nbsp;</li>
    <li style="float: left; padding-left: 10px" > <a style="font-size: 10px" href="#">| </a></li>
    <li style="float: left;padding-left: 10px" > <a style="font-size: 10px" @click="goOffline()">退出登录</a></li>



</ul>
<!-- 固定导航栏 -->

<div class="container">
    <div class="row nav upnav">
        <div class="col-lg-4"><h1><div style="font-family: 'Arial';">志愿填报网</div></h1></div>
        <div class="col lg-4"></div>
    </div>
    <div class="content">
        <p style="display:none">Lorem ipsum dolor dit amet</p>
        <p style="display:none">Lorem ipsum dolor dit amet</p>
        <ul class="venus-menu">
            <p style="display:none">Lorem ipsum dolor dit amet</p>
            <li  ><a href="#"><i class="icon-home"></i> <a href="index.html" style="font-weight: bold; color: rgb(57, 83, 131);">
                首页
            </a></a></li><p style="display:none">
            Lorem ipsum dolor dit amet</p>
            <p style="display:none">Lorem ipsum dolor dit amet</p>
            </li>
            <li><a href="#"><i class="icon ion-search"></i><a href="universities.html">
                院校查找
            </a></a></li><p style="display:none">
            Lorem ipsum dolor dit amet</p>
            </li>
            <li><a href="#"><i class="icon ion-android-hand"></i> <a href="majors.html">
                模拟填报
            </a></a>
                <p style="display:none">Lorem ipsum dolor dit amet</p>
            </li>
            <p style="display:none">Lorem ipsum dolor dit amet</p>
            </li>
            <li><a href="#"><i class="icon ion-ios-star-half"></i><a href="recommend.html">
                志愿推荐
            </a></a></li><p style="display:none">
            Lorem ipsum dolor dit amet</p>
            </li>
            <li><a href="#"><i class="icon ion-podium"></i><a href="#">
                大学排行
            </a></a></li><p style="display:none">
            Lorem ipsum dolor dit amet</p>
            </li>
            <li><a href="#"><i class="icon ion-android-exit"></i><a href="http://localhost/" target="_blank" >
                管理员入口
            </a></a></li><p style="display:none">
            Lorem ipsum dolor dit amet</p>
            </li>

            <p style="display:none">Lorem ipsum dolor dit amet</p>
            </li>
        </ul>
        <p style="display:none">Lorem ipsum dolor dit amet</p>
        <p style="display:none">Lorem ipsum dolor dit amet</p>
    </div>
</div>
<div class="container">
    <div style="margin-bottom: 30px;margin-top: 30px; margin-left: 20px;">
        <span class="yxtuijian2">2021年大学排行榜</span>
    </div>
    <div class="row">
        <div class="col-lg-1"></div>
        <div class="col-lg-104">
            <table  class="table table-borderd table-striped table-hover" style="color: rgb(85, 85, 85);" >
                <thead>
                <tr>
                    <th>排名</th>
                    <th>学校名称</th>
                    <th>类型</th>
                    <th>所在地</th>
                    <th>高校级别</th>
                    <th>综合得分</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td><span class="sortNum">1</span></td>
                    <td>清华大学</td>
                    <td>综合</td>
                    <td>北京市</td>
                    <td>双一流</td>
                    <td>136.37</td>
                </tr>
                <tr>
                    <td><span class="sortNum">2</span></td>
                    <td>北京大学</td>
                    <td>综合</td>
                    <td>北京市</td>
                    <td>双一流</td>
                    <td>127.48</td>
                </tr>
                <tr>
                    <td><span class="sortNum">3</span></td>
                    <td>浙江大学</td>
                    <td>综合</td>
                    <td>杭州市</td>
                    <td>双一流</td>
                    <td>120.48</td>
                </tr>
                <tr>
                    <td><span class="sortNum">4</span></td>
                    <td>上海交通大学</td>
                    <td>综合</td>
                    <td>上海市</td>
                    <td>双一流</td>
                    <td>103.21</td>
                </tr>
                <tr>
                    <td><span class="sortNum">5</span></td>
                    <td>武汉大学</td>
                    <td>综合</td>
                    <td>武汉市</td>
                    <td>双一流</td>
                    <td>96.93</td>
                </tr>
                <tr>
                    <td><span class="sortNum">6</span></td>
                    <td>南京大学</td>
                    <td>综合</td>
                    <td>南京市</td>
                    <td>双一流</td>
                    <td>83.27</td>
                </tr>
                <tr>
                    <td><span class="sortNum">7</span></td>
                    <td>华中科技大学</td>
                    <td>综合</td>
                    <td>武汉市</td>
                    <td>双一流</td>
                    <td>82.32</td>
                </tr>
                <tr>
                    <td><span class="sortNum">8</span></td>
                    <td>复旦大学</td>
                    <td>综合</td>
                    <td>上海市</td>
                    <td>双一流</td>
                    <td>81.46</td>
                </tr>
                <tr>
                    <td><span class="sortNum">9</span></td>
                    <td>四川大学</td>
                    <td>综合</td>
                    <td>成都市</td>
                    <td>双一流</td>
                    <td>81.02</td>
                </tr>
                <tr>
                    <td><span class="sortNum">10</span></td>
                    <td>吉林大学</td>
                    <td>综合</td>
                    <td>长春市</td>
                    <td>双一流</td>
                    <td>80.9</td>
                </tr>
                <tr>
                    <td><span class="sortNum">11</span></td>
                    <td>中山大学</td>
                    <td>综合</td>
                    <td>广州市</td>
                    <td>双一流</td>
                    <td>80.31</td>
                </tr>
                <tr>
                    <td><span class="sortNum">12</span></td>
                    <td>山东大学</td>
                    <td>综合</td>
                    <td>济南市</td>
                    <td>双一流</td>
                    <td>79.6</td>
                </tr>
                <tr>
                    <td><span class="sortNum">13</span></td>
                    <td>哈尔滨工业大学</td>
                    <td>工科</td>
                    <td>哈尔滨市</td>
                    <td>双一流</td>
                    <td>78.32</td>
                </tr>
                <tr>
                    <td><span class="sortNum">14</span></td>
                    <td>西安交通大学</td>
                    <td>综合</td>
                    <td>西安市</td>
                    <td>双一流</td>
                    <td>76.64</td>
                </tr>
                <tr>
                    <td><span class="sortNum">15</span></td>
                    <td>中南大学</td>
                    <td>综合</td>
                    <td>长沙市</td>
                    <td>双一流</td>
                    <td>75.32</td>
                </tr>
                <tr>
                    <td><span class="sortNum">16</span></td>
                    <td>中国科学技术大学</td>
                    <td>工科</td>
                    <td>合肥市</td>
                    <td>双一流</td>
                    <td>69.32</td>
                </tr>
                <tr>
                    <td><span class="sortNum">17</span></td>
                    <td>东南大学</td>
                    <td>综合</td>
                    <td>南京大学</td>
                    <td>双一流</td>
                    <td>68.24</td>
                </tr>
                <tr>
                    <td><span class="sortNum">18</span></td>
                    <td>中国人民大学</td>
                    <td>综合</td>
                    <td>北京市</td>
                    <td>双一流</td>
                    <td>65.32</td>
                </tr>
                <tr>
                    <td><span class="sortNum">19</span></td>
                    <td>天津大学</td>
                    <td>工科</td>
                    <td>天津市</td>
                    <td>双一流</td>
                    <td>64</td>
                </tr>
                <tr>
                    <td><span class="sortNum">20</span></td>
                    <td>华南理工大学</td>
                    <td>工科</td>
                    <td>广州市</td>
                    <td>双一流</td>
                    <td>59.64</td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>

</div>



<!-- footer -->
<div class="footer container">
    <div class="footertext">
        <div>联系电话: 123456789</div>
        <div>团队成员: 马秀坤 和理智 王贺 王乐斌 </div>
    </div>
</div>
</div>
</body>
</html>
<script src="js/vue.js"></script>
<script src="js/axios.min.js"></script>
<script>
    const app = new Vue({
        el:'#app',
        data:{
            users:{},
            type:"",
            region: [],
            types:[],
            selectedType:[],
            text:'',
            showGroup:false,
            colleges: [],
            selectedCollege:[],
            recommended:[],

            collegess:[],
            page:1,
            rows:9,
            totalPage:0,
            totals:0,

            beforeRec:true,
            afterRec:false
        },
        computed:{
            searchResult() {
                if (this.text!=='') {
                    return this.colleges.filter(
                        item =>
                            item.indexOf(this.text) > -1,
                        this.showGroup=true,
                    );
                } else {
                    this.showGroup=false
                    return this.colleges;
                }
            }
        },
        methods:{
            goOffline(){
                const storage = window.localStorage;
                storage.setItem("online","off");
                storage.setItem("userid",'');
                storage.setItem("role","user")
                alert("登出成功, 点击进入登陆页面")
                location.href='login.html';
            },
            test(){
                console.log(this.users.score.toString())    //分数
                console.log(this.users.type.toString())     //选课类型
                console.log(this.region.toString())         //意愿地区
                console.log(this.selectedType.toString())   //意愿专业类型
                console.log(this.selectedCollege.toString())//理想大学
            },
            findUserById(id){
                axios.get("http://localhost:8080/users/getUsersById?id="+id).then((res)=>{
                    console.log(res.data)
                    this.users = res.data;
                });
            },
            queryAllTypes(){
                axios.get("http://localhost:8080/majors/queryAllTypes").then((res)=>{
                    console.log(res.data)
                    this.types = res.data;
                });
            },
            queryAllCollegesName(){
                axios.get("http://localhost:8080/colleges/queryAllName").then((res)=>{
                    this.colleges = res.data;
                });
            },
            setSelectedCollege(item){
                this.selectedCollege = item;
                this.text = '';
            },
            doRecommend(){
                axios.get("http://localhost:8080/users/getRecommend?score="+this.users.score+
                    "&type="+this.users.type+"&aimRegion="+this.region+"&aimMajor="
                    +this.selectedType+"&aimCollege="+this.selectedCollege).then((res)=>{
                    this.recommended = res.data;
                    console.log(this.recommended)
                });
                this.beforeRec = false;
                this.afterRec = true;
            },


            findAll(indexpage){
                if(indexpage) this.page = indexpage;
                const _this = this;
                axios.get("http://localhost:8080/colleges/findByPage?page="+this.page+"&rows="+this.rows).then((res)=>{
                    console.log(res.data)
                    _this.collegess = res.data.colleges;
                    _this.totalPage = res.data.totalPage;
                    _this.totals = res.data.totals;
                });
            },
            findByTags(){
                const _this = this;
                console.log("page="+this.page+"&rows="+this.rows)
                axios.get("http://localhost:8080/colleges/findByPage?page="+this.page+"&rows="+this.rows).then((res)=>{
                    console.log(res.data)
                    console.log(location.href)
                    _this.collegess = res.data.colleges;
                    _this.totalPage = res.data.totalPage;
                    _this.totals = res.data.totals;
                });
            },
            toAdmin(){
                if(window.localStorage.getItem("role") === 'administrator') location.href='admin/user.html';
                else alert("非管理员 无授权进入管理员界面!")
            }
        },
        created(){
            if(0){
                window.location='login.html';
            }else {
                console.log(window.localStorage.getItem("userid").toString());
                this.findUserById(window.localStorage.getItem("userid").toString());
                this.queryAllTypes();
                this.queryAllCollegesName();
                this.findAll();
                this.beforeRec=true;
                this.afterRec=false;
            }
        }
    });
</script>
